<template>
	<view>
		<view class="tab-container bg-white margin-top" v-if="rooms.length > 0">
			<view class="cu-list menu">
				<view class="cu-item arrow" v-for="(item, key) in rooms" :key="key" :data-item="item"
					@click="myHouseDetail(item)">
					<view class="content padding-tb-sm">
						<view class="cuIcon-right margin-right-xs">
							<view class="title"></view>
							{{plotNum}}
						</view>
						<view class="text-gray text-sm">
							<text class="cuIcon-right margin-right-xs">房屋名称</text> {{item.houseName}}
						</view>
						<view class="text-gray text-sm">
							<text class="cuIcon-right margin-right-xs">房屋状态</text> {{item.houseStatus}}
						</view>
						<view class="text-gray text-sm">
							<text class="cuIcon-right margin-right-xs">房屋类型</text> {{item.houseType}}
						</view>
						<view class="text-gray text-sm">
							<text class="cuIcon-right margin-right-xs">备注</text> {{item.remark}}
						</view>
					</view>
					<view class="action">
						<view class="action_title" v-if="item.approvalStatus === 0">
							审核中
						</view>
						<!-- 					<view class="action_title" v-else-if="item.homeMemberType === 1">
							业主
						</view> -->
						<view class="action_title" v-if="item.approvalStatus === 1">
							业主
						</view>
						<!-- 					<view class="action_title" v-else-if="item.homeMemberType === 3">
							租户
						</view>
						<view class="action_title" v-else>
							租户成员
						</view> -->
					</view>
				</view>

				<view class="cu-item" v-if="rooms.length === 0">
					<view class="content">
						<text class="cuIcon-warn text-green"></text>
						<text class="text-grey">暂无房屋信息</text>
					</view>
					<view class="action">

					</view>
				</view>
			</view>
		</view>

		<view v-else>
			<no-data-page></no-data-page>
		</view>

		<view class="bindHandle">
			<button @click="bindApplication" type="primary">绑定申请</button>
			<button @click="bindRecord">绑定记录</button>
		</view>
	</view>
</template>

<script>
	// pages/my/myHouse.js
	import noDataPage from '@/components/no-data-page/no-data-page.vue'
	import context from '../../lib/java110/Java110Context.js';
	const constant = context.constant;

	export default {
		data() {
			return {
				userPhone: '', //业主手机号

				ownerData: '', //业主数据
				plotNum: '', //小区名
				plotCommunityId: '', //小区id
				rooms: "",
				owners: "",
				// identityType: '', //身份类型,
				// bindState:''
			};
		},

		components: {
			noDataPage
		},
		props: {},

		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad(options) {
			let ownerPhone = uni.getStorageSync("commonUser")
			this.userPhone = ownerPhone.phone
			let identityState = uni.getStorageSync("bindUserInfo");

			this.loadOwnerHouse();
			// this.ownerInfo() //拿到业主信息
		},

		/**
		 * 生命周期函数--监听页面初次渲染完成
		 */
		onReady: function() {},

		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow: function() {

			let _plotNum = uni.getStorageSync("_selectCommunity");
			// this.plotNum = _plotNum.communityName + "小区";

			if (_plotNum != null && _plotNum != undefined && _plotNum != '') {
				this.plotNum = _plotNum.communityName + "小区";
				this.plotCommunityId = _plotNum.id; //小区id
				console.log("小区ID", this.plotCommunityId)
				uni.setStorageSync('plotCommunityId', this.plotCommunityId);
			}

			this.loadOwnerHouse();
		},

		/**
		 * 生命周期函数--监听页面隐藏
		 */
		onHide: function() {},

		/**
		 * 生命周期函数--监听页面卸载
		 */
		onUnload: function() {},

		/**
		 * 页面相关事件处理函数--监听用户下拉动作
		 */
		onPullDownRefresh: function() {
			// this.loadOwnerHouse();
			uni.stopPullDownRefresh();
		},

		/**
		 * 页面上拉触底事件的处理函数
		 */
		onReachBottom: function() {},

		/**
		 * 用户点击右上角分享
		 */
		onShareAppMessage: function() {},
		methods: {
			myHouseDetail: function(_item) {
				uni.navigateTo({
					url: './myHouseDetail?room=' + JSON.stringify(_item)
				});
			},
			// 绑定申请
			bindApplication: function() {
				uni.navigateTo({
					url: './bindingApplication'
				})
			},

			// 绑定记录
			bindRecord: function() {
				uni.navigateTo({
					url: './bindRecord'
				})
			},

			/**
			 * 查看我的房屋绑定的信息并绑定成为业主
			 */
			loadOwnerHouse: function() {
				let plotCommunityIdData = uni.getStorageSync("_selectCommunity");
				this.plotCommunityId = plotCommunityIdData.id
				let _floorNum = uni.getStorageSync("buildingNameId");
				let _uniltNum = uni.getStorageSync("uniltNumId");
				let userId = uni.getStorageSync("commonUser");
				this.userId = userId.id
				uni.request({
					url: constant.url.bindHouseInfo,
					header: context.getHeaders(),
					method: "GET",
					data: {
						communityId: this.plotCommunityId,
						id: this.userId,
						phone: '',
						// whetherToRemove:'true',
						// phone:this.userPhone,
						type: ''
					},
					success: (res) => {
						this.rooms = res.data.result;
						uni.setStorageSync('hasHouse', this.rooms);

					},
					fail: function(e) {
						wx.showToast({
							title: "服务器异常了",
							icon: 'none',
							duration: 2000
						});
					}
				});
			},

			// 获取到业主信息
			// ownerInfo(){
			// 	uni.request({
			// 		url: constant.url.intoOwner,
			// 		header: context.getHeaders(),
			// 		method: "GET",
			// 		data: {
			// 			communityId:this.plotCommunityId,
			// 			phone:this.userPhone
			// 		},
			// 		success:(res) => {
			// 			this.ownerInfo = res.data.result
			// 			uni.setStorageSync('ownerInfo', this.ownerInfo);
			// 			console.log("业主信息88888",this.ownerInfo)
			// 		},
			// 		fail: function(e) {
			// 			wx.showToast({
			// 				title: "服务器异常了",
			// 				icon: 'none',
			// 				duration: 2000
			// 			});
			// 		}
			// 	});
			// }

		}
	};
</script>
<style scoped lang="scss">
	@import "@/pagesB/my/myHouse.css";

	.margin-top {
		margin-top: 0rpx;
	}

	.cu-list {
		width: 100%;
		overflow: auto;
		background-color: white;
		height: calc(100vh - 120rpx);

		.cu-item {
			background-color: #F5F5F5;
			margin: 20rpx 20rpx;
			border-radius: 30rpx;
		}
	}

	.bindHandle {
		width: 100%;
		height: 120rpx;
		position: fixed;
		align-items: center;
		bottom: 0rpx;
		display: flex;
		justify-content: space-around;
		background-color: aliceblue;

		button:nth-child(1) {
			margin: 15rpx;
			width: 300rpx;
			height: 80rpx;
			border-radius: 40rpx;
			font-size: 26rpx;
			line-height: 80rpx;
		}

		button:nth-child(2) {
			margin: 15rpx;
			width: 300rpx;
			height: 80rpx;
			border: 1rpx solid darkgrey;
			border-radius: 40rpx;
			background-color: #0081ff;
			font-size: 26rpx;
			color: white;
			line-height: 80rpx;
		}
	}
</style>
